<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/commons/taglibs.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<%@ include file="/commons/meta.jsp" %>
	<script type="text/javascript">
		function refreshImage(){
		    document.getElementById("codeImage").src="${ctx}/front/image.jsp?rand ="+Math.random();
		}
		
		document.onkeydown = function()
		{
		    if (event.keyCode == 13)
		    {
		        event.returnValue=false;
		        event.cancel = true;
		        document.getElementById("loginForm").submit();
		    }
		};
		
		function loginBlur(){
			if(event.srcElement.value=="")
				event.srcElement.value="登录名/ 邮箱";
		}
		
		function loginFocus(){
			//alert(event.srcElement.value);
			if(event.srcElement.value=="登录名/ 邮箱")
				event.srcElement.value="";
		}
	</script>
	
	<style type="text/css">

		#loginDiv {}
		
		#loginDiv div {margin: 20px 20px 20px 20px;vertical-align: middle;}
		
		#loginDiv div label {margin: 0px 40px 0px 20px;height: 26px;line-height: 26px;vertical-align: middle;}
		#loginDiv div span {margin: 0px 40px 0px 120px;line-height: 120%;vertical-align: middle;}
		
		.validation-advice {
			margin: 0px;
			padding:0px;
			color : #FF3300;
			font-weight: bold;
			display: block;
			float: left;
		}
		
	</style>
</head>

<body>

  	<div id="sub-header" class="twidth">
  	<div id="navsub">
		<div class="l"></div>
		<div class="r"></div>
		<div class="m">
		<div style="width:600px;float:left;">
			<a href="${ctx}/">首页</a> → <a href="">会员登陆</a>
		</div>
		</div>
	</div>
	
	<div class="twidth" style="margin-top:0px;color: #333;min-height: 500px;_height:500px;">
	
	<%@ include file="/commons/messages.jsp" %>
    <div style="width:100%;text-align: center;">
	  	<s:form action="/Login/login.do" id="loginForm" method="post" theme="simple">
	  	
	  	<div style="width: 320px;margin: 120px auto;border:solid 1px #ddd;" id="loginDiv">
	  
	  	<div style="text-align: left;margin-top: 10px;font-size: 14px;font-weight: bold;margin-left:10px">用户登陆</div>
	  	
	  	<div>
	  	 <label style="margin:0px 20px 0px 10px;text-align: right;padding:0px">用户名:</label>
	  	 <s:textfield name="members.loginName" id="loginName" value="登录名/ 邮箱" 
	  	 	onblur="loginBlur()" onfocus="loginFocus()" 
	  	  cssStyle="width:180px;" cssClass="required" required="true" />
	  	</div>
	  	
	  	<div>
	  	<label style="width: 100px;margin-right: 20px;text-align: right;margin-left:10px">密&nbsp;&nbsp;&nbsp;码:</label>
	  	<s:password name="members.password" id="password" value="%{model.password}"  cssStyle="width:180px;" cssClass="required " required="true" />
	  	</div>	
	  	
		<div style="margin:0px 20px 10px 60px!important;text-align: center">
		 <input type="checkbox" name="rememberMe" id="rememberMe" value="true" style="vertical-align: middle;margin-left: 20px" /><label for="rememberMe">记住密码30天</label>
		</div>
		
		<div style="margin:10px 20px 10px 20px;text-align: center;">		
			<input id="submitButton" name="submitButton" type="submit" style="width: 80px;height: 26px;vertical-align: middle;margin-left:50px" value="登   陆" />
			<a id="registerLink" style="margin-left:20px;vertical-align: middle;" href="${ctx}/Register/indexMembers.do">注册</a>
					<a id="registerLink" href="${ctx}/Register/getPwd.do" style="vertical-align: middle;">忘记密码</a>
		</div>
		</div>
	</s:form>
    </div>
       
	
  	</div>
  	<jsp:include page="/commons/bottom.html"  flush="true"></jsp:include>
  </div>
	<script>
		
		new Validation(document.forms[0],{onSubmit:true,immediate:false,onFormValidate : function(result,form) {
			var finalResult = result;
			
			//在这里添加自定义验证
			if(finalResult)
			{
				var value = $("#loginName").val();
				if(value=="登录名/ 邮箱"){
					alert("请输入登录名");
					$("#loginName").focus();
					return false;
				}
			}			
			return disableSubmit(finalResult,'submitButton');
		}});
		
		if('${model.loginName}'!='' ){
			$("#loginName").val('${model.loginName}');
		}
	</script>

</body>
	
</html>